import React from "react";
import OssMulImgUpload from "@/components/ossMultipleUpload/img";
import type { ProFormInstance } from "@ant-design/pro-form";
import { history } from "umi";
import ProForm, {
    ProFormItem
} from "@ant-design/pro-form";


const uploadFile: React.FC = () => {
    const onFinish = async (values: any) => {
        values.villages = values.villages.map((item: any) => {
            const title = item.villageName;
            // const title = villageList.find((village) => village.guid === item.villageId).title;
            const imageArr = item.imageArr.map((image: any) => {
                return {
                    url: image.url,
                };
            }
            );

            console.log('imageArr', imageArr);
        });
    };

    const formRef = React.useRef<ProFormInstance<any>>();

    return (
        <ProForm
            onFinish={onFinish}
            onReset={() => {
                formRef.current?.resetFields();
            }}
        >
            <ProFormItem
                name={'imageArr'}
                label="图片"
                rules={[
                    {
                        required: true,
                        message: '请上传图片!',
                    },
                ]}
                submitter={{
                    searchConfig: {
                        submitText: '保存',
                        resetText: '取消',
                    },
                    render: (_, dom) => [dom.pop(), dom.pop()],
                    submitButtonProps: {
                        style: {
                            marginRight: 10,
                        },
                        children: '保存',
                    },
                }}
            >
                <OssMulImgUpload
                    key={'imageArr'}
                    needCrop={false}
                />
            </ProFormItem>
        </ProForm>
    )
}

export default uploadFile;